<template>
    <div>
        <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
            <li v-for="item in list" :key="item.id">
                <router-link :to="{path:'/sfj/noticedetail',query:{id:item.id}}">
                    <div class="news">
                        <h1>{{item.noticeTitle}}</h1>
                        <img src="@/assets/sfj//images/more.png" alt="">
                    </div>
                    <span>{{item.createTimeStr}}</span>
                </router-link>
            </li>
        </van-list>
    </div>
</template>

<script>
    import home from '@/api/xcgg/home';
    import Vue from 'vue'
    import {List} from 'vant';


    Vue.use(List);

    export default {
        id: "",
        name: "notice-child-table-list",
        data() {
            return {
                list: [],
                page: 1,
                pageAll: 0,
                loading: false,
                finished: false,
                noData: false, // 如果没有数据，显示暂无数据
            };
        },
        methods: {
            getlawNoticeInfoList() {
                home.getlawNoticeInfoList(this.page, this.limit, this.noticeTitle)
                    .then(response => {
                        this.page++;
                        this.pageAll = Math.ceil(response.data.count / this.$parent.limit);
                        this.list = this.list.concat(response.data.data);

                        // 如果没有数据，显示暂无数据
                        if (this.list.length === 0 && this.page === 1) {
                            this.finished = true
                        }
                        // 如果加载完毕，显示没有更多了
                        if (response.data.data.length === 0) {
                            this.finished = true
                        }

                        // 加载状态结束
                        this.loading = false;

                        // 数据全部加载完成
                        if (this.page > this.pageAll) {
                            this.finished = true;
                        }
                    });
            },
            onLoad: function () {
                this.getlawNoticeInfoList();
            },
        },
        watch: {
            noticeTitle() {
                this.list = [];
                this.page = 1;
                this.limit = 10;
                this.getlawNoticeInfoList();
            }
        },
        props: ['noticeTitle']
    }
</script>

<style>
</style>
